<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./node_modules/react/umd/react.production.min.js"></script>
    <script src="./node_modules/react-dom/umd/react-dom.production.min.js"></script>
</head>

<body>
    <div id='root'>

    </div>
    <script>

        // console.log(root);
        /* 
        创建一个元素  + 渲染元素
        React.createElement(元素名称,属性,内容)
        */
        //    var qq=React.createElement('div',{class:'active',id:'h1'},'我是一个h1标签',React.createElement('div',{class:'active2',id:'h2'},'我是2个h1标签'))
        //    ReactDOM.render(qq,document.querySelector('#root'))

       
        var qq2 = React.createElement('div', { class: 'active2', id: 'h2' }, '我是2个h1标签')
        var qq3 = React.createElement('div', { class: 'active3', id: 'h3' }, '我是3个h1标签')

        var qq = React.createElement('div', { class: 'active', id: 'h1' }, '我是一个h1标签',[qq2,qq3])
        ReactDOM.render(qq, document.querySelector('#root'))
    </script>

</body>
</html>